var hotAdministrativeItem = document.getElementById("administrative_container"); // 热门事项列表滚动区域元素
var hotAdministrativeItemCon = document.getElementById("administrative_hotCon"); // 热门事项列表元素
var hotItemSpeed = 50; // 热门事项滚动速度
var hotItemTimer = null;

function renderAdministrative(type) {
  var data = type === 'zw' ? administrativeData : proveData
  var hotContainer = document.getElementById("administrative_hotCon")
  var str = "";
  // 清空旧内容
  hotContainer.innerHTML = "";

  data.forEach((item, index) => {
    str += "<tr>";
    if (index < 9) {
      str +=
        '<td style="width: 20%;font-style: italic;">0' +
        (index + 1) +
        "</td>";
    } else {
      str +=
        '<td style="width: 20%;font-style: italic;">' +
        (index + 1) +
        "</td>";
    }
    str +=
      '<td style="text-align:left;width: 60%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;padding-right: 10rem;">' +
      item.name +
      "</td>" +
      '<td style="width: 20%;text-align:left">' +
      item.count +
      "</td>" +
      "</tr>";
  });
  hotContainer.innerHTML = str;
  hotItemListRoll()
}

function hotItemListRoll() {
  clearInterval(hotItemTimer); // 清除旧定时器
  hotAdministrativeItemCon.innerHTML += hotAdministrativeItemCon.innerHTML; // 列表数据复制实现循环滚动
  hotAdministrativeItem.scrollTop = 0; // 重置滚动位置
  hotItemTimer = setInterval(hotItemListRollStop, hotItemSpeed); // 创建新定时器
}

function hotItemListRollStop() {
  if (hotAdministrativeItem.scrollTop >= hotAdministrativeItemCon.scrollHeight / 2) {
    hotAdministrativeItem.scrollTop = 0; // 回到顶部
  } else {
    hotAdministrativeItem.scrollTop++; // 逐像素滚动
  }
}

// 鼠标移入
hotAdministrativeItem.onmouseover = function () {
  clearInterval(hotItemTimer);
};
// 鼠标移除
hotAdministrativeItem.onmouseout = function () {
  hotItemTimer = setInterval(hotItemListRollStop, hotItemSpeed);
};


$(function () {
  // 渲染政务事项
  renderAdministrative('zw');

  $(".perTownCount>div").click(function () {
    $(this).parents(".perTownCount").find("div").removeClass("active");
    $(this).addClass("active");
    var type = $(this).attr("data-type");
    renderAdministrative(type);
  });
})